<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>浮动定位的理解</title>
</head>
<body>
<!--- 格式: float:left/right
- 元素脱离文档流,元素从当前所在行向左或向右浮动, 当撞到上级元素边缘或其它浮动元素时停止移动
- 多个浮动元素一行装不下时会自动折行,折行时 如果有凸出的元素会卡主
- 当某个元素的所有子元素全部浮动时,自动识别的高度会为0,后面的元素会顶上来导致显示异常,
    通过给元素添加overflow:hidden解决
- 应用场景: 当需要将纵向排列的元素改成横向排列时使用浮动定位.-->
</body>
</html>